import React, { Component } from 'react';
import actionCreator from '../header/actionCreator'
import {connect} from 'react-redux'
import BScroll from 'better-scroll'
import Detail from '../detail/detail'
// import moment from 'moment'
import {push,history} from 'react-router-redux'
import {NavLink,Route,Switch} from 'react-router-dom'
import './list.css'

 class List extends Component {
     constructor(props){
         super(props);
        this.state={
            studio:false,
            page:1,
            count:2
        }
         
     }
     componentDidMount(){
             this.props.getList(this.state.page,'101')
             this.scroll = new BScroll(this.refs.list,{scrollY:true,mouseWheel:true,
                                pullUpLoad:{threshold:0}
                            })
             this.scroll.on("pullingUp",()=>{
                //  this.scroll.finishPullUp()
                //  this.scroll.refresh()
                 this.setState({
                     page:this.state.page+1,

                 },()=>{
                     if(!this.flag){
                         this.props.getList(this.state.page,'101')
                         console.log(this.state.page)
                         this.scroll.finishPullUp()
                     }
                 })
             })
     }
    componentDidUpdate(prevProps){
        if(this.state.studio!==this.props.studio){
            // console.log(this.props.id)
            this.props.getList(this.state.page,this.props.id);
            this.setState({
                studio : this.props.studio,
                page:1,
            },()=>{
            })
        }
    }
    render() {
        var moment = require('moment')
        return (
            <div className="list" ref="list">
                <ul className="listbox" ref="listbox">
                <NavLink to='/detail'>a</NavLink>
                <Route path='/detail' Component={Detail}/>
                    {
                        this.props.loading?<div><i className="iconfont icon-jiazaizhong">加载中...</i></div>:
                       this.props.infolist.map((item,index)=>{
                            return <li key={index}>
                            <NavLink to={`http://m.hao123.com`+item.url}>
                            {item.type==='cms'?<div>冠名广告招商</div>:
                                    <div>
                                        <h4>{item.title}</h4> 
                                    </div>
                                }  
                                    {
                                        item.img_list.length===0?'':
                                     <div>
                                        {
                                            item.img_list.length>1?item.img_list.map((imgitem,index)=>{
                                                return <span key={index}><img src={imgitem.img.s} alt="" /></span>
                                            }):<img className="one" src={item.img_list[0].img.s} alt=""/>

                                        }
                                     </div>
                                    } 
                                    <div>
                                         {
                                            item.publish_time!==0?
                                        <p>
                                        <span>{item.author}</span>&nbsp;
                                        <span>{moment(item.publish_time*1000).format('YYYY-MM-DD')}</span>
                                        </p>
                                        :<p>{item.display_time}</p>
                                        
                                         }
                                    </div> 
                               </NavLink>
                            </li>                            
                        })
                    }
                </ul>
             <Route path='/detail' Component={Detail} />
            </div>
        );
    }
}

export default connect((state)=>state.header,actionCreator)(List);